<template>
  <div id="certification">
    <div class="certification2">
      <el-link type="info" :underline="false" style="left: -80px;top: -20px" @click="toLogin()">< 返回</el-link>
      <div>
        <h2>完善信息</h2>
        <el-form ref="form" :model="form" label-width="">
          <el-form-item>
            <el-input v-model="form.name" style="width: 300px;" placeholder="请输入真实姓名"></el-input>
          </el-form-item>
          <el-form-item>
            <el-input v-model="form.studentID" style="width: 300px;" placeholder="请输入学号"></el-input>
          </el-form-item>
          <el-form-item>
            <el-select v-model="form.school" placeholder="请选择学校" style="width: 300px">
              <el-option v-for="(x,index) in schools" :key="index" :value="x.schoolId"
                         :label="x.schoolName"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-radio v-model="form.sex" label="1">男</el-radio>
            <el-radio v-model="form.sex" label="2">女</el-radio>
          </el-form-item>
          <el-form-item>
            <el-input v-model="form.tel" style="width: 300px;" placeholder="请输入电话(可不用输入)"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit(form.name,form.studentID,form.school,form.sex,form.userId,form.tel)"
                       style="width: 300px;margin-top: 20px">完成
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "Certification",
  data() {
    return {
      form: {
        name: '',
        studentID: '',
        school: '',
        sex: '1',
        tel: '',
        userId: localStorage.getItem('userId')
      },
      schools: [],
    }
  },
  methods: {
    onSubmit(name, studentID, school, sex, userId, tel) {
      axios('/open/register/1', {
        params: {
          schoolId: school,
          userGender: sex,
          userId: userId,
          userName: name,
          userNumber: studentID,
          userTel: tel
        },
        method: "post",
      }).then(res => {
        console.log(res.data)
        this.$router.push('/Login')
      }).catch(function (error) {
        console.log(error);
      });
    },
  },
  mounted() {
    axios('/open/school', {
      method: "get",
    }).then(res => {
      // console.log(res.data)
      this.schools = res.data.data
      // console.log(this.schools)
    }).catch(function (error) {
      console.log(error);
    });
  }
}
</script>

<style scoped>

#certification {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #e6e6e6;
}

.certification2 {
  border-radius: 20px;
  margin-left: 34%;
  margin-top: 3%;
  padding-left: 100px;
  padding-top: 50px;
  background: white;
  box-shadow: 4px 4px 4px #ccc;
  width: 400px;
  height: 530px;
}

</style>
